<%@ page import="com.bw.pojo.Phone" %>
<%@ page import="java.util.List" %><%--
  Created by IntelliJ IDEA.
  User: Aaking-aline
  Date: 2022-05-10
  Time: 10:53
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
    <head>
        <title>手机信息页</title>

        <style>
            table,th,tr,td {
                border: #cccccc 1px solid;
                border-collapse: collapse;
            }

            span {
                color: deepskyblue;
            }

            #addBtn {
                background-color: aquamarine;
            }
        </style>

    </head>
    <body>

        <%
            List<Phone> list = (List<Phone>)request.getAttribute("list");
            List<String> phone_names = (List<String>)request.getAttribute("phone_names");
            List<String> phone_models = (List<String>)request.getAttribute("phone_models");

            if(list == null){
                request.getRequestDispatcher("SelectServlet?page=1").forward(request,response);
                return ;
            }

            if(phone_names == null){
                request.getRequestDispatcher("SelectPhoneNameServlet").forward(request,response);
                return ;
            }

            if(phone_models == null){
                request.getRequestDispatcher("SelectPhoneModelServlet").forward(request,response);
                return ;
            }
        %>



        <center>
            <form action="SelectServlet2">
            手机品牌:<select name="phone_name">
                        <% for (String phone_name :phone_names) { %>
                                <option value="<%=phone_name%>"><%=phone_name%></option>
                        <% } %>
                    </select>
            机型:<select name="phone_model">
                        <% for (String phone_model :phone_models) { %>
                            <option value="<%=phone_model%>"><%=phone_model%></option>
                        <% } %>
                </select>
                <input type="submit" value="查询">
                <input type="button" value="添加" id="addBtn" onclick="addBtn1()">
                <input type="button" value="批量删除" onclick="delectAllElem()">
            </form>


                <br>
                <table>
                    <tr>
						<td><input type="checkbox" onclick="selectAll(this)">全选/反选</td>
                        <td>手机品牌</td>
                        <td>手机机型</td>
                        <td>销售单价</td>
                        <td>出厂日期</td>
                        <td>操作</td>
                    </tr>

                    <% for(Phone phone : list) { %>
                        <tr>
							<td><input type="checkbox" class="selectElem" value="<%=phone.getId()%>"></td>
                            <td><%=phone.getPhone_name()%></td>
                            <td><%=phone.getPhone_model()%></td>
                            <td><%=phone.getPhone_price()%></td>
                            <td><%=phone.getPhone_producer()%></td>
                            <td>
                                <span onclick="deletePhone(<%=phone.getId()%>)">删除</span>
                                <span onclick="updatePhone(<%=phone.getId()%>)">修改</span>
                            </td>
                        </tr>
                    <% } %>
                </table>
                <span class="span1" onclick="gotoHome()">首页</span>
                <span class="span1" onclick="gotoPre()">上一页</span>
                <span class="span1" onclick="gotoNext()">下一页</span>
                <span class="span1" onclick="gotoEnd()">尾页</span>
        </center>
    </body>


    <script>
        function gotoHome(){
        	window.location.href = "SelectServlet?page=1";
        }

		function gotoPre(){
			let page = <%=request.getAttribute("page")%>;
			if(parseInt(page) == 1){
				return ;
            }
			window.location.href = "SelectServlet?page=" + (parseInt(page) - 1);
		}

		function gotoNext(){
			let page = <%=request.getAttribute("page")%>;
			if(parseInt(page) == <%=request.getAttribute("pageNum")%>){
				return ;
            }
			window.location.href = "SelectServlet?page=" + (parseInt(page) + 1);
		}

		function gotoEnd(){
			window.location.href = "SelectServlet?page=" + <%=request.getAttribute("pageNum")%>;
		}


		function addBtn1(){
            window.location.href = "addPage.jsp";
        }

        function deletePhone(e){
            let b = window.confirm("确认删除吗");

            if(b){
                window.location.href = "DeletePhoneServlet?id=" + e;
            }
        }


        function updatePhone(e){
            window.location.href = "updatePhone.jsp?id=" + e;
        }

        function selectAll(e){
        	let arr = window.document.getElementsByClassName("selectElem");

        	for(let i = 0;i < arr.length;i++){
				arr[i].checked = e.checked;
			}
		}

		function delectAllElem(){
			let arr = window.document.getElementsByClassName("selectElem");
			let str = "";
			for(let i = 0;i < arr.length;i++){
				if(arr[i].checked == true){
					str = str + arr[i].value + ",";  // 1,2,3,
				}
			}
			str = str.slice(0,str.length-1); // 1,2,3

			console.log(str);

			window.location.href = "DeletePhoneServlet?id=" + str;   // DeletePhoneServlet?id=1,2,3
		}


    </script>



</html>
